<template>
	<el-container id="app">
		<el-header>
			<vHeader></vHeader>
		</el-header>
		<el-row class="bg-big">
			<el-col :span="5" >
				<el-aside>
					<vAside></vAside>
				</el-aside>
			</el-col>
			<el-col :span="19" class="bg-main">
				<el-main>

					<router-view/>

				</el-main>
				<el-footer>
					<vFooter></vFooter>
				</el-footer>
			</el-col>
		</el-row>
		<!--<router-view/>-->
	</el-container>
</template>

<script>
	import vHeader from '@/components/common/v-header';
	import vAside from '@/components/common/v-aside';
	import vFooter from '@/components/common/v-footer';
	export default {
		name: 'App',
		components: {
			vHeader,
			vAside,
			vFooter
		}
	}
</script>

<style>
	#app {
		font-family: "Microsoft YaHei", 'Avenir', Helvetica, Arial, sans-serif;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		text-align: center;
		color: #2c3e50;
	}
	.el-main {
		padding-top: 0;
	}
	.bg-big {
		background: #545c64;
	}
	.bg-main {
		background: #fff;
	}
</style>